﻿<catel:DataWindow x:Class="Catel.Articles.Base.UI.Windows.ExamplesWindow"
                  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
                  xmlns:Controls="clr-namespace:Catel.Articles.Base.UI.Controls" 
                  xmlns:ViewModels="clr-namespace:Catel.Articles.Base.UI.ViewModels"
                  xmlns:catel="http://catel.codeplex.com"
                  x:TypeArguments="ViewModels:ExamplesViewModel"
                  SizeToContent="Manual" ResizeMode="CanResize" Width="800" Height="700"
                  ShowInTaskbar="True" WindowStartupLocation="CenterScreen"
                  Icon="/Catel.Articles.Base;component/Resources/Images/Catel.png">

    <!-- Resources -->

    <!-- Content -->
    <DockPanel>
        <!-- Explanation + theme picker --> 
        <Grid DockPanel.Dock="Top">
            <!-- Row definitions -->
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            
            <!-- Column definitions -->
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <!-- Explanation / description -->
            <Label Grid.Row="0" Grid.RowSpan="2" Grid.Column="0">
                <TextBlock TextWrapping="Wrap" Text="{Binding Description}" />
            </Label>

            <!-- Theme picker -->
            <StackPanel Grid.Row="0" Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Right">
                <!-- Label -->
                <Label Content="Theme" />

                <!-- Combobox -->
                <ComboBox ItemsSource="{Binding ThemeCollection}" SelectedItem="{Binding SelectedTheme}" DisplayMemberPath="Name"
                          Width="175" />
            </StackPanel>
        </Grid>
        
        <!-- Trace output control -->
        <catel:TraceOutputControl DockPanel.Dock="Bottom" Height="150" />

        <!-- List of examples -->
        <ListBox DockPanel.Dock="Left" SelectionMode="Single" MaxWidth="250"
                 ItemsSource="{Binding Examples}" SelectedItem="{Binding SelectedExample}"
                 ScrollViewer.HorizontalScrollBarVisibility="Disabled">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <!-- Row definitions -->
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="10" />
                        </Grid.RowDefinitions>

                        <!-- Column definitions -->
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <!-- Title -->
                        <TextBlock Grid.Row="0" Grid.ColumnSpan="2" FontWeight="Bold" TextWrapping="Wrap" Text="{Binding Name}" />

                        <!-- Explanation -->
                        <TextBlock Grid.Row="1" Grid.Column="1" TextWrapping="Wrap" Text="{Binding ShortDescription}" />
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <!-- Example details -->
        <Controls:ExampleControl DataContext="{Binding SelectedExample}" />
    </DockPanel>
</catel:DataWindow>
